<div class="code-editor">
    <div class="left-box">
        <app-file-tree [rootPath]="projectPath" [(selectedFile)]="selectedFile"
            (selectedFileChange)="selectedFileChange($event)"></app-file-tree>
    </div>
    <div class="right-box">
        @if (openedFiles.length > 0) {
        <nz-tabset [nzSize]="'small'" [(nzSelectedIndex)]="selectedIndex" (nzSelectedIndexChange)="onTabChange($event)"
            nzType="editable-card" [nzHideAdd]="true" (nzClose)="closeTab($event)">
            @for (file of openedFiles; track file.path; let i = $index) {
            <nz-tab nzClosable [nzTitle]="titleTemplate">
                <ng-template #titleTemplate>
                    <span class="tab-inner" (mousedown)="handleMiddleClick($event, i)">
                        {{ file.title }} <span class="blue-point" *ngIf="file.isDirty"></span>
                    </span>
                </ng-template>
            </nz-tab>
            }
        </nz-tabset>
        <app-monaco-editor [code]="code" (codeChange)="onCodeChange($event)" [sdkPath]="sdkPath"
            [librariesPath]="librariesPath"></app-monaco-editor>
        } @else {
        <div class="empty-editor" style="padding: 15px;">
            <div>这是代码编辑器，是一个测试功能，还不能正常使用</div>
            <div>进入到这个页面是因为你打开了一个不存在.abi文件的目录</div>
            <div>你可以通过界面左上角的菜单重新打开正确的项目</div>
            <div>奈何col 2025.3.20</div>
        </div>
        }
    </div>
</div>

<app-notification></app-notification>